<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
  <meta name="robots" content="noindex">
  <title>Pellentesque habitant morbi senectus - Infinite Ajax Scroll Example</title>
  <link rel="stylesheet" href="css/style.css">
  <style>
    .status {
      text-align: center;
      margin-top: 29px;
      min-height: 40px;
    }

    .loader {
      height: 40px;
      margin-top: 0;
      text-align: center;
      background: transparent url('svg/loader.svg') no-repeat center center;
      background-size: 40px 19px;
      opacity: 0;
      animation: flipAnimation 1s infinite;
      transition: opacity 300ms;
    }
  </style>
</head>
<body>
<div class="surface-container">
  <div class="article" id="article2"><h1>Pellentesque habitant morbi senectus</h1>
    <p class="article__p--first">At augue eget arcu dictum varius. Tempus iaculis urna id volutpat lacus. Blandit massa
      enim nec dui nunc mattis. Fames ac turpis egestas maecenas pharetra convallis posuere. Facilisi etiam dignissim
      diam quis enim lobortis scelerisque fermentum dui. Euismod elementum nisi quis eleifend quam adipiscing vitae
      proin sagittis. Aliquet risus feugiat in ante. Amet tellus cras adipiscing enim eu turpis egestas pretium.</p>
    <figure><img src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/3/hero.jpg">
      <figcaption>At tempor commodo ullamcorper.</figcaption>
    </figure>
    <p>Non curabitur gravida arcu ac tortor dignissim convallis. Sed felis eget velit aliquet sagittis id consectetur
      purus. Tincidunt dui ut ornare lectus sit amet est placerat. Maecenas accumsan lacus vel facilisis. Molestie ac
      feugiat sed lectus vestibulum mattis ullamcorper velit sed.</p>
    <p>Vitae auctor eu augue ut lectus arcu bibendum at varius. Amet consectetur adipiscing elit pellentesque habitant
      morbi tristique. Elementum integer enim neque volutpat ac. At tempor commodo ullamcorper a. Diam quam nulla
      porttitor massa id neque aliquam vestibulum. Velit sed ullamcorper morbi tincidunt ornare massa. Urna duis
      convallis convallis tellus id. </p>
    <p>Sit amet volutpat consequat mauris nunc congue. Mattis vulputate enim nulla aliquet porttitor lacus luctus
      accumsan. Proin libero nunc consequat interdum varius sit amet. Vitae semper quis lectus nulla at volutpat diam ut
      venenatis. Orci ac auctor augue mauris. Gravida rutrum quisque non tellus orci ac. Ornare arcu odio ut sem nulla
      pharetra diam sit. Vestibulum lectus mauris ultrices eros in cursus turpis massa. </p></div>

    <p>Sit amet volutpat consequat mauris nunc congue. Mattis vulputate enim nulla aliquet porttitor lacus luctus
      accumsan. Proin libero nunc consequat interdum varius sit amet. Vitae semper quis lectus nulla at volutpat diam ut
      venenatis. Orci ac auctor augue mauris. Gravida rutrum quisque non tellus orci ac. Ornare arcu odio ut sem nulla
      pharetra diam sit. Vestibulum lectus mauris ultrices eros in cursus turpis massa. </p></div>

    <p>Sit amet volutpat consequat mauris nunc congue. Mattis vulputate enim nulla aliquet porttitor lacus luctus
      accumsan. Proin libero nunc consequat interdum varius sit amet. Vitae semper quis lectus nulla at volutpat diam ut
      venenatis. Orci ac auctor augue mauris. Gravida rutrum quisque non tellus orci ac. Ornare arcu odio ut sem nulla
      pharetra diam sit. Vestibulum lectus mauris ultrices eros in cursus turpis massa. </p></div>

    <p>Sit amet volutpat consequat mauris nunc congue. Mattis vulputate enim nulla aliquet porttitor lacus luctus
      accumsan. Proin libero nunc consequat interdum varius sit amet. Vitae semper quis lectus nulla at volutpat diam ut
      venenatis. Orci ac auctor augue mauris. Gravida rutrum quisque non tellus orci ac. Ornare arcu odio ut sem nulla
      pharetra diam sit. Vestibulum lectus mauris ultrices eros in cursus turpis massa. </p></div>

    <p>Sit amet volutpat consequat mauris nunc congue. Mattis vulputate enim nulla aliquet porttitor lacus luctus
      accumsan. Proin libero nunc consequat interdum varius sit amet. Vitae semper quis lectus nulla at volutpat diam ut
      venenatis. Orci ac auctor augue mauris. Gravida rutrum quisque non tellus orci ac. Ornare arcu odio ut sem nulla
      pharetra diam sit. Vestibulum lectus mauris ultrices eros in cursus turpis massa. </p></div>

    <p>Sit amet volutpat consequat mauris nunc congue. Mattis vulputate enim nulla aliquet porttitor lacus luctus
      accumsan. Proin libero nunc consequat interdum varius sit amet. Vitae semper quis lectus nulla at volutpat diam ut
      venenatis. Orci ac auctor augue mauris. Gravida rutrum quisque non tellus orci ac. Ornare arcu odio ut sem nulla
      pharetra diam sit. Vestibulum lectus mauris ultrices eros in cursus turpis massa. </p></div>

    <p>Sit amet volutpat consequat mauris nunc congue. Mattis vulputate enim nulla aliquet porttitor lacus luctus
      accumsan. Proin libero nunc consequat interdum varius sit amet. Vitae semper quis lectus nulla at volutpat diam ut
      venenatis. Orci ac auctor augue mauris. Gravida rutrum quisque non tellus orci ac. Ornare arcu odio ut sem nulla
      pharetra diam sit. Vestibulum lectus mauris ultrices eros in cursus turpis massa. </p></div>

    <p>Sit amet volutpat consequat mauris nunc congue. Mattis vulputate enim nulla aliquet porttitor lacus luctus
      accumsan. Proin libero nunc consequat interdum varius sit amet. Vitae semper quis lectus nulla at volutpat diam ut
      venenatis. Orci ac auctor augue mauris. Gravida rutrum quisque non tellus orci ac. Ornare arcu odio ut sem nulla
      pharetra diam sit. Vestibulum lectus mauris ultrices eros in cursus turpis massa. </p></div>

    <p>Sit amet volutpat consequat mauris nunc congue. Mattis vulputate enim nulla aliquet porttitor lacus luctus
      accumsan. Proin libero nunc consequat interdum varius sit amet. Vitae semper quis lectus nulla at volutpat diam ut
      venenatis. Orci ac auctor augue mauris. Gravida rutrum quisque non tellus orci ac. Ornare arcu odio ut sem nulla
      pharetra diam sit. Vestibulum lectus mauris ultrices eros in cursus turpis massa. </p></div>

    <p>Sit amet volutpat consequat mauris nunc congue. Mattis vulputate enim nulla aliquet porttitor lacus luctus
      accumsan. Proin libero nunc consequat interdum varius sit amet. Vitae semper quis lectus nulla at volutpat diam ut
      venenatis. Orci ac auctor augue mauris. Gravida rutrum quisque non tellus orci ac. Ornare arcu odio ut sem nulla
      pharetra diam sit. Vestibulum lectus mauris ultrices eros in cursus turpis massa. </p></div>

    <p>Sit amet volutpat consequat mauris nunc congue. Mattis vulputate enim nulla aliquet porttitor lacus luctus
      accumsan. Proin libero nunc consequat interdum varius sit amet. Vitae semper quis lectus nulla at volutpat diam ut
      venenatis. Orci ac auctor augue mauris. Gravida rutrum quisque non tellus orci ac. Ornare arcu odio ut sem nulla
      pharetra diam sit. Vestibulum lectus mauris ultrices eros in cursus turpis massa. </p></div>

  <div class="status">
    <div class="loader"></div>
    <div class="no-more">No more pages</div>
  </div>
  <div class="pager"><a href="index.html" class="pager__prev">&leftarrow; Prev article</a> <a href="page3.html" class="pager__next">Next
    article &rightarrow;</a></div>
</div>
<script src="js/index.js"></script>
</body>
</html>